<!--
 * @Author: CelestialProof
 * @Description: POWERED BY CELESTIALPROOF
 * @Date: 2020-09-16 14:01:37
-->
<template>
	<div id="offWork">{{ this.msg }}</div>
</template>

<script>
export default {
	name: "male",
	data: () => {
		return {
			msg: "",
		};
	},
	mounted() {
		let that = this;
		setInterval(function() {
			that.msg = that.offWork();
		}, 1000);
		that.msg = that.offWork();
	},
	methods: {
		offWork: () => {
			let time = new Date()
					.toTimeString()
					.substr(0, 8)
					.split(":"),
				ms =
					(17 - +time[0]) * 60 * 60 * 1000 -
					+time[1] * 60 * 1000 -
					+time[2] * 1000;
			let h = parseInt(ms / (60 * 1000 * 60)),
				min = parseInt((ms % (1000 * 60 * 60)) / (1000 * 60)),
				s = Math.floor((ms % (1000 * 60)) / 1000);
			return "离下班还有:" + h + "小时" + min + "分钟" + s + "秒";
		},
	},
};
</script>

<style>
#offWork {
	position: absolute;
	color: #fff;
	left: 50%;
	transform: translateX(-50%);
	top: 80vh;
}
</style>
